import Other from "./other"
import { createContext, useState } from "react"
type themeContext = {
    color: string
}
type themeContent = {
    text: string
}
//一个context
export let theme = createContext<themeContext>({ color: 'red' })
//两个Context

export let content = createContext<themeContent>({ text: 'react从入门到精通' })

const UseContextCom = () => {
    let [themeColor, setThemeColor] = useState<themeContext>({ color: 'deepskyblue' })

    setTimeout(() => {
        setThemeColor({ color: 'hotpink' })
    }, 2000)
    return (
        <fieldset>
            <legend>UseContext</legend>
            <theme.Provider value={themeColor}>
                <content.Provider value={{ text: 'vue3从入门到精通' }}>
                    <Other />
                </content.Provider>
            </theme.Provider>
        </fieldset>
    )
}

export default UseContextCom